<script setup>

	import {ref, reactive} from 'vue'
	import {useRouter, useRoute} from "vue-router"
    import addressApi from '@/api/member/address'

	const router = useRouter()
	const route = useRoute()

    const data = reactive({
        addressList: [],
        chosenAddressId: 0
    })

    const initData = () => {
        addressApi.getAddressList().then(response => {
            data.addressList = response.data
        })

        data.chosenAddressId = ~~route.query.addressId
    }
    initData()

    const handleAdd = () => {
	    router.push({
            name: 'EditAddress',
            query: {...route.query}
        })
    }

    const handleEdit = (item,index) => {
        router.push({
            name: 'EditAddress',
            query: {...route.query,id: item.id}
        })
    }

    const handleSelect = (item,index) => {

	    if(Object.keys(route.query).length === 0){
	        //参数为0，来源为主页的地址管理，不跳转
            return
        }

        router.push({
            name: 'OrderPreview',
            query: {...route.query,addressId: item.id}
        })
    }

</script>

<template>
	<van-nav-bar title="选择地址" left-text="返回" left-arrow @click-left="$router.go(-1)"/>

	<van-address-list
            v-model="data.chosenAddressId"
			:list="data.addressList"
			default-tag-text="默认"
			@add="handleAdd"
			@edit="handleEdit"
			@select="handleSelect"
	/>

	<van-empty v-if="data.addressList.length === 0" description="还没地址，请新添加"/>

</template>

<style scoped lang="scss">
	.my-swipe .van-swipe-item {
	}

	.product_item {
		display: block;
	}
</style>
